<%--
  Created by IntelliJ IDEA.
  User: Dhy
  Date: 2023/9/4
  Time: 10:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>首页</title>
    <link href="./layui/css/layui.css" rel="stylesheet">
  </head>
  <body>
  <div class="layui-layout layui-layout-admin">
    <div class="layui-header">
      <div class="layui-logo layui-hide-xs layui-bg-black">在线教育管理系统</div>
      <!-- 头部区域（可配合layui 已有的水平导航） -->

      <ul class="layui-nav layui-layout-right">
        <li class="layui-nav-item layui-hide layui-show-sm-inline-block">
          <a href="javascript:;">
            <img src="//unpkg.com/outeres@0.0.10/img/layui/icon-v2.png" class="layui-nav-img">
            ${user.username}
          </a>
          <dl class="layui-nav-child">
<%--
              使用 javascript:; 封禁超链接的href属性
              重新定义class类，通过jquery调用函数触发新的事件
--%>
            <dd><a href="javascript:;" class="modifiedPwd">修改密码</a></dd>
            <dd><a href="/loginOut">退出</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
          <a href="javascript:;">
            <i class="layui-icon layui-icon-more-vertical"></i>
          </a>
        </li>
      </ul>
    </div>
    <div class="layui-side layui-bg-black">
      <div class="layui-side-scroll">
        <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
        <ul class="layui-nav layui-nav-tree" lay-filter="test">
          <li class="layui-nav-item">
            <dd><a class="" href="javascript:;" data-url="home.jsp" id="home">首页</a></dd>
          <li class="layui-nav-item">
            <a class="" href="javascript:;" >教师管理</a>
            <dl class="layui-nav-child">
                <dd><a href="javascript:;" data-url="/Teacher/teacherList.jsp" id="teacher_lookposlist">查看教师信息</a></dd>
              <dd><a href="javascript:;" data-url="/Teacher/teacherInsert.jsp">添加教师信息</a></dd>
            </dl>
          </li>
          <li class="layui-nav-item">
            <a href="javascript:;">学生管理</a>
            <dl class="layui-nav-child">
                <dd><a href="javascript:;" data-url="/Student/studentList.jsp" id="lookposlist">查看学生信息</a></dd>
                <dd><a href="javascript:;" data-url="/Student/studentInsert.jsp">添加学生信息</a></dd>
            </dl>
          </li>
          <li class="layui-nav-item">
            <a href="javascript:;">课程管理</a>
            <dl class="layui-nav-child">
                <dd><a href="javascript:;" data-url="/Course/courseList.jsp" id="course_lookposlist">查看课程信息</a></dd>
                <dd><a href="javascript:;" data-url="/Course/courseInsert.jsp">添加课程信息</a></dd>
            </dl>
          </li>
        </ul>
      </div>
    </div>
    <div class="layui-body">
      <!-- 内容主体区域 -->
      <div style="padding: 15px;">
        <blockquote class="layui-elem-quote layui-text">
<%--          Layui 框体布局内容主体区域--%>
        </blockquote>
        <div class="layui-card layui-panel">
          <div class="layui-card-header">
          </div>
          <div class="layui-card-body">

          </div>
        </div>
        <br><br>
      </div>
    </div>
    <div class="layui-footer">
      <!-- 底部固定区域 -->
      底部固定区域
    </div>
  </div>

  <script src="./layui/layui.js"></script>
  <script>
    //JS
    layui.use(['element', 'layer', 'util'], function () {
      // 局部变量
      var element = layui.element;
      var layer = layui.layer;
      var util = layui.util;
      $ = layui.$;    //全局变量

      //头部事件
      // 定义一个函数,url地址作为参数，对 openUrl 作了定义，  $('.layui-body>div').load(url); load可以直接加载一个页面信息到.layui-body>div中
      openUrl = function (url) {
        if (!url) {
          // layer.msg  弹窗弹出提示信息
          layer.msg("无效的url");
        } else {
          // load可以直接加载一个页面信息到指定div中
          $('.layui-body>div').load(url);
        }
      }

      // 点击事件
      $('.layui-nav-tree dd a').click(function () {
        // 调用openUrl函数，打开一个链接
        openUrl($(this).attr('data-url'));
      })
      //进入首页时默认点击首页
      //点击首页
      $('#home').click();
      //修改密码
      $('.modifiedPwd').click(function () {
        //地址跳转到'modifiedPwd.jsp'
        openUrl('modifiedPwd.jsp');
      })

    });
  </script>
  </body>
</html>
